import React, {
	PureComponent
} from 'react';
import { connect } from 'dva';
import moment from 'moment';
import { Row, Col, Card, Form, Input, Select, Icon, Button, Dropdown, Menu, InputNumber, DatePicker, Modal, TreeSelect, Tree, message, Badge, Divider, Upload, Radio, label, Table, Popconfirm } from 'antd';
import StandardTable from '../../components/StandardTable';
import PageHeaderLayout from '../../layouts/PageHeaderLayout';
import styles from '../Mana/Role.less';
import { getusername } from '../../utils/utils';

//默认状态
var state;

/*角色*/
const { MonthPicker, RangePicker } = DatePicker;
const dateFormat = 'YYYY-MM-DD';
const FormItem = Form.Item;
const { Option } = Select;
const TreeNode = Tree.TreeNode;
const confirm = Modal.confirm;
const {
	TextArea
} = Input;
const getValue = obj => Object.keys(obj).map(key => obj[key]).join(',');
//客户电话列表
var phoneList = [];
var childAndPacakage = [];
var pacakages=[];
var pacakages1=[];
var classrooms=[];
var classes=[];
var classroomPackage=[];
var children=[];
var selectRows=[];
var selectRows1=[];
var curData={};
var flag=false;
const columns2 = [{
	title: '序号',
	dataIndex: 'childrenId',
	key: 'childrenId',
	width:'8%'
}, {
	title: '孩子名称',
	dataIndex: 'childrenName',
	key: 'childrenName',
	width:'15%'
}, {
	title: '上课进度',
	dataIndex: 'buyPackageName',
	key: 'buyPackageName',
	width:'15%'
}, {
	title: '期望上课时间',
	dataIndex: 'expectedTimes',
	key: 'expectedTimes',
	width:'50%'
}];
//table复选框选中
// rowSelection objects indicates the need for row selection
var rowSelections2 = "";
const rowSelection2 = {
	getCheckboxProps(record) {
		return {
			defaultChecked: record.isRole == 1, // 配置默认勾选的列
		};
	},
	onSelect: (record, selected, selectedRows) => {
		rowSelections2 = new Object(); //声明对象
		rowSelections2.selected = selected;
		rowSelections2.selectedRows = selectedRows;
	},
	onSelectAll: (selected, selectedRows, changeRows) => {
		rowSelections2 = new Object(); //声明对象
		rowSelections2.selected = selected;
		rowSelections2.selectedRows = selectedRows;
	},
};
const CreateForm = Form.create()(props => {
	const {
		modalVisible,
		form,
		handleAdd,
		handleModalVisible,
		title,
		obj,
		selectedRows,
		queryPackageByClassroom,
		queryDataByPhone,
		handleSelectRows1,
		handleStandardTableChange,
		getChild
	} = props;
	const {
		getFieldDecorator
	} = form;
    const flag=false;
	const okHandle = () => {
		if(title == "新建" || title == "编辑") {
			form.validateFields((err, fieldsValue) => {
				if(err) return;
				if(fieldsValue.state == undefined) {
					fieldsValue.state = 1
				};
				if(fieldsValue.description == undefined) {
					fieldsValue.description = ""
				};
				handleAdd(title, obj.roleId, fieldsValue);
			});
		} else {
			form.validateFields((err, fieldsValue) => {
				handleAdd(title, obj.roleId, fieldsValue);
			});
		}
	};
	if(title == "组班") {
			return(
				<Modal
				maskClosable={false}
				destroyOnClose={true}
				width={'60%'}
				title={title}
				visible={modalVisible}
				onOk={okHandle}
				onCancel={() => handleModalVisible(false,'','')}
		>
				<Form layout="horizontal">
						<FormItem label="初始化教室：" labelCol={{span: 8}}  wrapperCol={{span: 12}} className={styles.w50left}>
								{getFieldDecorator('classroomList', {
									rules: [{ required: true, message: '教室不能为空！' }],
								})(<Select placeholder="请选择" onChange={queryPackageByClassroom}>
										{classrooms}
								</Select>)}
						</FormItem>
						<FormItem label="课程包：" labelCol={{span: 8}}  wrapperCol={{span: 12}} className={styles.w50left}>
								{getFieldDecorator('coursePackage', {
									rules: [{ required: true, message: '课程包不能为空！' }],
								})(<Select placeholder="请选择" onChange={getChild}>
										{pacakages1}
								</Select>)}
						</FormItem>
						<FormItem label="主课教师：" labelCol={{span: 8}}  wrapperCol={{span: 12}} className={styles.w50left}>
								{getFieldDecorator('teacherName', {
									initialValue:obj.teacherName==undefined ? "":obj.teacherName,
									rules: [{ required: true, message: '主课教师不能为空！' }],
								})(<Input placeholder="主课教师" disabled/>)}
						</FormItem>
						<FormItem label="容纳人数：" labelCol={{span: 8}}  wrapperCol={{span: 12}} className={styles.w50left}>
								{getFieldDecorator('tmAcceptanceNum', {
									initialValue:obj.tmAcceptanceNum==undefined ? "":obj.tmAcceptanceNum,
									rules: [{ required: true, message: '容纳人数不能为空！' }],
								})(<Input placeholder="容纳人数" disabled/>)}
						</FormItem>
						<FormItem label="班级名称：" labelCol={{span: 8}}  wrapperCol={{span: 12}} className={styles.w50left}>
								{getFieldDecorator('className', {
									rules: [{ required: true, message: '班级不能为空！' }],
								})(<Input placeholder="班级名称" />)}
						</FormItem>
						<FormItem label="班级编号：" labelCol={{span: 8}}  wrapperCol={{span: 12}} className={styles.w50left}>
								{getFieldDecorator('classCode', {
									rules: [{ required: true, message: '班级编号！' }],
								})(<Input placeholder="班级编号" />)}
						</FormItem>
						<StandardTable
							data={children}
							columns={columns2}
							onSelectRow={handleSelectRows1}
							onChange={handleStandardTableChange}
							pagination={
								{
								showQuickJumper:false,
								showSizeChanger:false,
								simple:true
								}
							}
						/>
				</Form>
			</Modal>
			)
	} 
	else if(title=='插班'){
		return(
					<Modal
					maskClosable={false}
					destroyOnClose={true}
					width={'40%'}
					title={title}
					visible={modalVisible}
					onOk={okHandle}
					onCancel={() => handleModalVisible(false,'','')}
				>
					<Form layout="horizontal">
							<FormItem label="可选班级" >
									{form.getFieldDecorator('classId')(<Select placeholder="请选择" onChange={queryDataByPhone}>
																										{classes}
																									</Select>)}
							</FormItem>
				</Form>
				</Modal>
				);
	}
	else{
		return(
					<Modal
					maskClosable={false}
					destroyOnClose={true}
					width={'60%'}
					title={title}
					visible={modalVisible}
					onOk={okHandle}
					onCancel={() => handleModalVisible(false,'','')}
				>
					<Form layout="horizontal">
											<FormItem label="客户电话" >
													{form.getFieldDecorator('phone',{
									initialValue:obj.userPhone==undefined?"":obj.userPhone,
								})(<Select placeholder="请选择" onChange={queryDataByPhone}>
																													{phoneList}
																												</Select>)}
											</FormItem>
												<FormItem label="孩子/已拥包" >
														{form.getFieldDecorator('child',{
									initialValue:obj.childrenName==undefined&&obj.buyPackageName==undefined?"":obj.childrenId+"/"+obj.childrenName+"/"+obj.buyPackageName,
								})(<Select placeholder="请选择">
																															{childAndPacakage}
																													</Select>)}
												</FormItem>
		
								<FormItem label="绑定包：">
										{form.getFieldDecorator('pacakage',{
											initialValue:obj.buyPackageName==undefined?"":obj.buyPackageId+","+obj.buyPackageName,
										})(<Select placeholder="请选择">
																										{pacakages}
																									</Select>)}
								</FormItem>
								<FormItem label="购买日期：">
									{form.getFieldDecorator('buyData',{
										initialValue:obj.creatTime==undefined?"":moment(obj.creatTime, dateFormat),
									})(<DatePicker format={dateFormat} defaultValue={moment(obj.creatTime, dateFormat)} format={dateFormat}/>)}
								</FormItem>
				</Form>
				</Modal>
				);
	}
});



@connect(({ bindPackage, loading }) => ({
	bindPackage,
	loading: loading.models.bindPackage,
}))

@Form.create()
export default class TableList extends PureComponent {
	state = {
		modalVisible: false,
		expandForm: false,
		selectedRows: [],
		formValues: {},
		obj: "",
		children:[]
	};

	componentDidMount() {
		const { dispatch } = this.props;
		/*获取list*/
		dispatch({
			type: 'bindPackage/queryList',
			payload: {
			},
		});
		/* 获取客户电话列表 */
		dispatch({
			type: 'bindPackage/queryPhoneList',
			payload: {
				
			},
			callback:function(res,data){
				phoneList = [];
				if(res == 1) {
					for(let i = 0; i < data.length; i++) {
						phoneList.push(<Option key={data[i].userId+","+data[i].phone}>{data[i].phone}</Option>);
					}
				}
			}
		});
		/* 查询所有的课程包 */
		dispatch({
			type: 'bindPackage/queryPacakage',
			payload: {
				
			},
			callback:function(res,data){
				pacakages = [];
				if(res == 1) {
					for(let i = 0; i < data.length; i++) {
						pacakages.push(<Option key={data[i].coursePageId+","+data[i].name }>{data[i].name }</Option>);
					}
				}
			}
		});
		/* 查询所有的教室 */
		dispatch({
			type: 'bindPackage/queryClassroom',
			payload: {
				
			},
			callback:function(res,data){
				classrooms = [];
				if(res == 1) {
					classroomPackage=data;
					for(let i = 0; i < data.length; i++) {
						classrooms.push(<Option key={data[i].classroomId+","+data[i].name }>{data[i].name }</Option>);
					}
				}
			}
		});
		/* 查询所有的班级 */
		dispatch({
			type: 'bindPackage/queryClassByPackageOfChild',
			payload: {
				
			},
			callback:function(res,data){
				classes = [];
				if(res == 1) {
					for(let i = 0; i < data.length; i++) {
						classes.push(<Option key={data[i].classId+","+data[i].className }>{data[i].className }</Option>);
					}
				}
			}
		});
	}

	handleStandardTableChange = (pagination, filtersArg, sorter) => {
		const {
			dispatch
		} = this.props;
		const {
			formValues
		} = this.state;
		const filters = Object.keys(filtersArg).reduce((obj, key) => {
			const newObj = { ...obj
			};
			newObj[key] = getValue(filtersArg[key]);
			return newObj;
		}, {});
		const params = {
			currentPage: pagination.current,
			pageSize: pagination.pageSize,
			...formValues,
			...filters,
		};
		if(sorter.field) {
			params.sorter = `${sorter.field}_${sorter.order}`;
		}
		dispatch({
			type: 'bindPackage/queryList',
			payload: params,
		});
	};
	handleSelectRows = rows => {
		this.setState({
			selectedRows: rows,
		});
	};
	handleSelectRows1 = rows => {
		selectRows=rows;
		console.log(selectRows.length)
		if(selectRows.length>this.state.obj.tmAcceptanceNum){
			message.info('选择学生数目不能超过班级容纳数量！');
			selectRows = selectRows.slice(0,this.state.obj.tmAcceptanceNum);
			console.log(selectRows)
		}
	};
	/* 点击客户电话 查询孩子/已拥包 */
	queryDataByPhone = (e) =>{
		flag=true;
		var curData=e.split(',');
		const {
			dispatch,
		} = this.props;
		dispatch({
			type: 'bindPackage/queryDataByPhone',
			payload: {
				phone:curData[1]
			},
			callback:function(res,data){
				if(res==1){
					childAndPacakage=[];
					for(let i = 0; i < data.length; i++) {
						if(data[i].coursePageName==null){
							childAndPacakage.push(<Option key={data[i].childrenId+","+data[i].childrenName}>{data[i].childrenName}</Option>);
						}else{
							childAndPacakage.push(<Option key={data[i].childrenId+","+data[i].childrenName}>{data[i].childrenName+"/"+data[i].coursePageName}</Option>);
						}
					}
				}
			}
		});
	}
	/* 点击教室获取教室下面的绑定包 */
	queryPackageByClassroom = (e) =>{
		var curData=e.split(',');
		const {
			dispatch,
		} = this.props;
		for(let i = 0; i < classroomPackage.length; i++) {
			if(curData[0]==classroomPackage[i].classroomId){
				this.setState({
					obj:classroomPackage[i]
				})
			}
		}
		dispatch({
			type: 'bindPackage/queryPackageByClassroom',
			payload: {
				classroomId:curData[0]
			},
			callback:function(res,data){
				if(res==1){
					pacakages1=[];
					for(let i = 0; i < data.length; i++) {
							pacakages1.push(<Option key={data[i].coursePageId+","+data[i].pageName}>{data[i].pageName}</Option>);
					}
				}
			}
		});
	}
	/* 点击课程包查询孩子列表 */
	getChild = e => {
		var curData=e.split(',');
		const {
			dispatch,
			form
		} = this.props;
		/* 查询所有的孩子列表 */
		dispatch({
			type: 'bindPackage/queryChildren',
			payload: {
				buyPackageId:curData[0],
				state:0
			},
			callback: (res, data) => {
				if(res == 1) {
					children=data;
				} else {
				}
			},
		});
	}
	handleSearch = e => {
		e.preventDefault();
		const {
			dispatch,
			form
		} = this.props;
		form.validateFields((err, fieldsValue) => {
			if(err) return;
			const values = { ...fieldsValue,
			};
			this.setState({
				formValues: values,
			});
			console.log(values)
			if(values.classId == undefined) values.classId = ""
			if(values.package == undefined) values.package = ""
			if(values.state == undefined) values.state = ""
			dispatch({
				type: 'bindPackage/queryList',
				payload: {
					classId:values.classId.split(',')[0],
					buyPackageId:values.package.split(',')[0],
					state:values.state
				}
			});
		});
	};
	handleFormReset = () => {
		const {
			form,
			dispatch
		} = this.props;
		form.resetFields();
		this.setState({
			formValues: {},
		});
		dispatch({
			type: 'bindPackage/queryList',
		});
	}
	/*弹窗 */
	handleModalVisible = (flag, record, title) => {
		const {
			dispatch,
			form
		} = this.props;
		var obj = "";
		/*关闭弹窗-取消-colse*/
		if(flag == false) {
			this.setState({
				modalVisible: flag,
				title: title,
				obj: obj,
			});
			children=[];
			curData={};
		} else {
			/*操作关闭*/
			if(title == "新增") {
				this.setState({
					modalVisible: flag,
					title: title,
					obj: obj,
				});
			} else if(title=='组班'){
					this.setState({
						modalVisible: flag,
								title: title,
					});
				}
			else {
				const { selectedRows } = this.state;
				if((record == undefined || Object.keys(record).length == 0) && Object.keys(selectedRows).length == 0) {
					message.info("还未选择项");
				} else if(Object.keys(selectedRows).length > 1) {
					message.info("只能选择一项进行操作");
				} else {
					var Ids = [];
					if(record != undefined && Object.keys(record).length > 0) {
						Ids = record;
					} else if(selectedRows != null) {
						Ids.push(selectedRows.map(row => row.roleId).join(','));
					}
					if(title == "编辑") {
						this.setState({
							modalVisible: flag,
							title: title,
							obj: selectedRows[0],
						});
					}
					else if(title=='退班'){
						if(record.state==0){
							message.info('您还未加入任何班级！');
						}else if(record.state==1){
						confirm({
							title: '确认要退班?',
							content: '退班后将无法再进入班级学习',
							okText: '是',
							okType: 'danger',
							cancelText: '否',
							onOk() {
									dispatch({
										type: 'bindPackage/deletClassForm',
										payload: {
											childrenId:record.childrenId,
											coursePageId:record.buyPackageId,
											slfBindingChildrenId:record.slfBindingChildrenId,
											classId:record.classId
										},
										callback: (res, resMsg) => {
											if(res == 1) {
												message.info(resMsg);
													dispatch({
														type: 'bindPackage/queryList',
														payload: {
														},
													});
											} else {
												message.info(resMsg);
											}
										},
									});
							},
							onCancel() {
								console.log('Cancel');
							},
						});
						}
					}
					else if(title=='插班'){
							this.setState({
								modalVisible: flag,
								title: title,
							});
							curData=record;
							/* 根据所选小孩筛选出班级列表 */
							dispatch({
								type: 'bindPackage/queryClassByPackageOfChild',
								payload: {
									coursePackageId:record.buyPackageId,
								},
								callback: (res, data) => {
									classes = [];
									if(res == 1) {
										for(let i = 0; i < data.length; i++) {
											classes.push(<Option key={data[i].classId+","+data[i].className}>{data[i].className}</Option>);
										}
									}else{
										
									}
								}
							});
					}
				}
			}
		}
	};
	/*编辑，绑定*/
	handleAdd = (title, Id, fields) => {
		const {
			selectedRows
		} = this.state;
		if(title == "新增") {
			var dadaJson={
				childrenId:fields.child.split(',')[0],
				childrenName:fields.child.split(',')[1],
				phone:fields.phone.split(',')[1],
				buyPackageId:fields.pacakage.split(',')[0],
				buyPackageName:fields.pacakage.split(',')[1],
				creatTime:moment(fields.buyData.format('YYYY-MM-DD'))._i,
			}
			this.props.dispatch({
				type: 'bindPackage/insertBindPacakage',
				payload: dadaJson,
				callback: (res, resMsg) => {
					if(res == 1) {
						message.info(resMsg);
						this.props.dispatch({
							type: 'bindPackage/queryList',
							payload: {
							},
						});
						this.setState({
							modalVisible: false,
								});
					} else {
						message.info(resMsg);
					}
				},
			});
		} 
		else if(title == "组班") {
			var ids=[];
			for(let i = 0; i < selectRows.length; i++) {
					ids.push(selectRows[i].slfBindingChildrenId);
			}
			var dadaJson={
				classroomId:fields.classroomList.split(',')[0],
				className:fields.className,
				classCode:fields.classCode,
				classroomName:fields.classroomList.split(',')[1],
				coursePackageId:fields.coursePackage.split(',')[0],
				coursePackageName:fields.coursePackage.split(',')[1],
				classNumber:fields.tmAcceptanceNum,
				parameter:ids
			}
			if(ids.length==0){
				message.error('还未选择孩子，不能提交哦');
			}else{
				this.props.dispatch({
					type: 'bindPackage/insetClassForm',
					payload:dadaJson,
					callback: (res, resMsg) => {
						if(res == 1) {
							message.success(resMsg);
							this.props.dispatch({
								type: 'bindPackage/queryList',
								payload: {
								},
							});
							this.setState({
								modalVisible: false,
							});
							children=[];
						} else {
							message.error(resMsg);
						}
					},
				});
			}
		} else if(title=='插班'){
			var dadaJson={
				classId:fields.classId.split(',')[0],
				className:fields.classId.split(',')[1],
				childrenId:curData.childrenId,
				childrenName:curData.childrenName,
				buyPackageId:curData.buyPackageId,
				buyPackageName:curData.buyPackageName,
				courseId:curData.courseId,
				courseName:curData.courseName,
				slfBindingChildrenId:curData.slfBindingChildrenId
			}
			this.props.dispatch({
				type: 'bindPackage/checkInClass',
				payload:dadaJson,
				callback: (res, resMsg) => {
					if(res == 1) {
						message.success(resMsg);
						this.props.dispatch({
							type: 'bindPackage/queryList',
							payload: {
							},
						});
						this.setState({
							modalVisible: false,
						});
					} else {
						message.error(resMsg);
					}
				},
			});
		}else if(title=='编辑'){
			var dadaJson={};
			if(flag==false){
			dadaJson={
				childrenId:fields.child.split('/')[0],
				childrenName:fields.child.split('/')[1],
				phone:fields.phone,
				buyPackageId:fields.pacakage.split(',')[0],
				buyPackageName:fields.pacakage.split(',')[1],
				creatTime:moment(fields.buyData.format('YYYY-MM-DD'))._i,
				slfBindingChildrenId:selectedRows[0].slfBindingChildrenId
			}
			}else{
			dadaJson={
					childrenId:fields.child.split(',')[0],
					childrenName:fields.child.split(',')[1],
					phone:fields.phone.split(',')[1],
					buyPackageId:fields.pacakage.split(',')[0],
					buyPackageName:fields.pacakage.split(',')[1],
					creatTime:moment(fields.buyData.format('YYYY-MM-DD'))._i,
					slfBindingChildrenId:selectedRows[0].slfBindingChildrenId
				}
			}
			this.props.dispatch({
				type: 'bindPackage/updateForm',
				payload:dadaJson,
				callback: (res, resMsg) => {
					if(res == 1) {
						message.success(resMsg);
						this.props.dispatch({
							type: 'bindPackage/queryList',
							payload: {
							},
						});
						flag=false;
						this.setState({
							modalVisible: false,
						});
					} else {
						message.error(resMsg);
					}
				},
			});
		}
	};

	/*删除*/
	confirmModel = (title, Id) => {
		const { dispatch } = this.props;
		const { selectedRows } = this.state;
		if(Id == undefined && Object.keys(selectedRows).length == 0) {
			message.info("还未选择项");
		} else {
			var Ids = [];
			/*获取选中的用户名字*/
			var name =[];
			if(Id != undefined) {
				Ids = Id;
				name = Id;
			} else if(selectedRows != null) {
				Ids.push(selectedRows.map(row => row.roleId).join(','));
				name.push(selectedRows.map(row => row.name).join(','));
			}
			for(var i=0;i<name.length;i++){
				if(name[i] == getusername()){
					console.log("不能对自己进行操作");
				}
			}
			
			
			if(title == "删除") {
				Modal.confirm({
					title: '是否删除当前选中数据',
					content: '',
					onOk() {
// 						dispatch({
// 							type: 'manarole/remove_role',
// 							payload: {
// 								roleIds: Ids,
// 							},
// 							callback: (res, resMsg) => {
// 								if(res == 1) {
// 									message.success(resMsg);
// 								} else {
// 									message.error(resMsg);
// 								}
// 							},
// 						});
					},
				});
			} else if(title == "启用" || title == "禁用") {
				var state;
				if(title == "启用") {
					state = 1;
				} else {
					state = 0;
				}
				Modal.confirm({
					title: '是否' + title + '当前数据选中',
					onOk() {
// 						dispatch({
// 							type: 'manarole/edit_role_state',
// 							payload: {
// 								roleIds: Ids,
// 								state: state,
// 							},
// 							callback: (res, resMsg) => {
// 								if(res == 1) {
// 									message.success(resMsg);
// 								} else {
// 									message.error(resMsg);
// 								}
// 							},
// 						});
					},
				});
			}

		}
	}

	renderSimpleForm() {
		const {
			getFieldDecorator
		} = this.props.form;
		return(
			<Form onSubmit={this.handleSearch} layout="inline">
			<Row gutter={{ md: 8, lg: 24, xl: 48 }}>
				<Col md={6} sm={24}>
					<FormItem label="班级：">
						{getFieldDecorator('classId', {
						})(<Select placeholder="请选择">
									{classes}
							</Select>)}
					</FormItem>
				</Col>
				<Col md={6} sm={24}>
					<FormItem label="课包：">
							{getFieldDecorator('package', {
							})(<Select placeholder="请选择">
										{pacakages}
								</Select>)}
					</FormItem>
				</Col>
				<Col md={6} sm={24}>
					<FormItem label="排班情况：">
							{getFieldDecorator('state', {
							})(<Select placeholder="请选择">
										<Option value="1">已排班</Option>
										<Option value="0">未排班</Option>
								 </Select>)}
					</FormItem>
				</Col>
        	<Col md={6} sm={24}>
           	<span className={styles.submitButtons} style={{ float: 'right'}}>
              <Button type="primary" htmlType="submit">查询</Button>
              <Button style={{ marginLeft: 8 }} onClick={this.handleFormReset}>重置</Button>
            </span>
          </Col>
        </Row>
      </Form>
		);
	}
	renderForm() {
		return this.state.expandForm = this.renderSimpleForm();
	}

	render() {
		const { bindPackage: { data }, loading } = this.props;
		const {
			selectedRows,
			modalVisible,
			title,
			obj,
		} = this.state;
		/*const rowKey = function(record) {
		  return record.roleId;  //主键id
		};*/
		const columns = [
		{
			title: '孩子名称',
			dataIndex: 'childrenName',
			key: 'childrenName',
			width: '10%',
		}, 
		{
			title: '购买包名',
			dataIndex: 'buyPackageName',
			key: 'buyPackageName',
			width: '20%',
		}, 
		{
			title: '上课进度',
			dataIndex: 'courseName',
			key: 'courseName',
			width: '20%',
		}, 
		{
			title: '班级名',
			dataIndex: 'className',
			key: 'className',
			width: '10%',
			render: (text, record, index) => {
				if(record.className == undefined) {
					return "暂未加入班级"
				} else {
					return text
				}
			}
		},
		{
			title: '是否排班',
			dataIndex: 'state',
			key: 'state',
			width: '5%',
			render: (text, record, index) => {
				if(record.state == 1) {
					return "是"
				} else if(record.state == 0) {
					return "否"
				}
			}
		},
		{
			title: '状态',
			dataIndex: 'flag',
			key: 'flag',
			width: '5%',
			render: (text, record, index) => {
				if(record.flag == 1) {
					return "有效"
				} else if(record.flag == 0) {
					return "无效"
				}
			}
		},
		{
			title: '录入时间',
			dataIndex: 'creatTime',
			key: 'creatTime',
			width: '15%',
		},
		{
			title: '操作',
			render: (text, record, index) => {
				return (
				<div>
					<Button type="primary" size={'small'} onClick={() => this.handleModalVisible(true,record,'退班')}>退班</Button>
					<Button type="primary" size={'small'} style={{'marginLeft':'8px'}} onClick={() => this.handleModalVisible(true,record,'插班')}>插班</Button>
				</div>
				)
			}
		},
		 ];
		const parentMethods = {
			handleAdd: this.handleAdd,
			handleModalVisible: this.handleModalVisible,
			confirmModel: this.confirmModel,
			queryDataByPhone: this.queryDataByPhone,
			queryPackageByClassroom: this.queryPackageByClassroom,
			handleSelectRows1: this.handleSelectRows1,
			handleStandardTableChange:this.handleStandardTableChange,
			getChild:this.getChild
		};
		return(
			<PageHeaderLayout title="课程系统/绑定线下课程包">
      	<Card bordered={false}>
          <div className={styles.tableList}>
            <div className={styles.tableListForm}>{this.renderForm()}</div>
            <div className={styles.submitButtons}>
            	<Button type="primary"  onClick={() => this.handleModalVisible(true,'','新增')}>新增</Button>
            	<Button type="primary"  onClick={() => this.handleModalVisible(true,'','编辑')}>编辑</Button>
							<Button  type="ghost"   onClick={() => this.handleModalVisible(true,'','组班')}>组班</Button>
		      	
            </div>
            <StandardTable
              selectedRows={selectedRows}
              loading={loading}
              data={data}
              columns={columns}
              onSelectRow={this.handleSelectRows}
              onChange={this.handleStandardTableChange}
            />
          </div>
        <CreateForm {...parentMethods} modalVisible={modalVisible} title={title} obj={obj}/>
      </Card>
      </PageHeaderLayout>
		);
	}
}